﻿@import "variables.less";
@import "mixins.less";
//
// 时间线
//
.time-line {
    padding: @time-line-padding;
    .clearfix;
}

.time-line-item {
    position: relative;
    float: left;
    width: 135px;
    text-align: center;
    div {
        &:first-child {
            position: relative;
            margin: 0 auto 10px;
            width: 28px;
            height: 28px;
            border-radius: 50%;
            border: 2px solid #a6c4f6;
            .box-sizing(content-box);
            line-height: 1.8;
            font-weight: bold;
            font-size: @font-size-medium;
            z-index: 3;
        }
    }
    &:first-child em {
        display: none;
    }
    em {
        position: absolute;
        display: inline-block;
        top: 13px;
        right: 83px;
        height: 6px;
        width: 104px;
        background: @gray-lighter;
        z-index: 2;
    }
    &.active {
        div:first-child {
            color: white;
            background: @primary;
        }
        em {
            background: #a6c4f6;
        }
    }
}